<template>
	<view class="center-view">
		<view class="desc-item dashboard">
			<text class="item-name">报名主题</text>
			<input v-model="title" style="padding-left:10upx;" class="item-content theme-input normal-font-size"/>
		</view>
		<view class="desc-item dashboard">
			<text class="item-name">报名信息需要审核</text>
			<switch @change="isChecked=!isChecked" :checked="isChecked" class="item-switch" color="green"/>
		</view>
		<!-- changeIsChecked -->
		<view v-show="isChecked" class="desc-item dashboard" style="width:98%;">
			<text class="item-name">启用脚本自动审核</text>
			<switch @change="autoCheck=!autoCheck" :checked="autoCheck" class="item-switch" color="green"/>
		</view>
		<!-- <view class="desc-item" >
				<text>是否开启自动审核:</text><switch style="margin-top:6upx;margin-left:140upx;margin-right:90upx;"/>
		</view> -->
		<view class="desc-item dashboard">
			<text class="item-name">允许注册用户填写</text>
			<switch @change="tempRegister=!tempRegister" :checked="tempRegister" class="item-switch" color="green"/>
		</view>
		<view class="desc-item dashboard">
			<text class="item-name">开启自动结束报名</text>
			<switch @change="autoEnd=!autoEnd" :checked="autoEnd" class="item-switch" color="green"/>
		</view>
		<view class="desc-item dashboard" v-show="autoEnd" style="width:98%">
			<text class="item-name dashboard">人数达标自动结束</text>
			<switch @change="numEnd=!numEnd" :checked="numEnd" class="item-switch" color="green"/>
		</view>
		<view class="desc-item dashboard" v-show="autoEnd&&numEnd"  style="width:96%">
			<text class="item-name">人数限制</text>
			<input v-model="numLimit" type="number" class="item-content theme-input" style="width:100upx;text-align:right;padding-right:10upx"/>
		</view>
		<view class="desc-item dashboard" v-show="autoEnd" style="width:98%">
			<text class="item-name">时间到达自动结束</text>
			<switch @change="timeEnd=!timeEnd" :checked="timeEnd" class="item-switch" color="green"/>
		</view>
		<view class="desc-item dashboard" v-show="autoEnd&&timeEnd" style="width:96%">
			<text class="item-name">预计截止时间</text>
			<datetimePicker class="item-content" ref="planEndTime"  />
		</view>
		<button @click="submit" type="primary" style="background-color:green;width:80%;margin-top:10upx;">下一步</button>
	</view>
</template>


<script>
	import datetimePicker from "../../components/basic/datetime-picker";
	export default {
		components : {
			datetimePicker
		},
		data: function () {
			return {
				enrollData : {},
				title : "",
				isChecked : false,
				tempRegister : false,
				autoCheck : false,
				autoEnd : false,
				numEnd : false,
				numLimit : 50,
				timeEnd : false,
				// timeLimit : ""
			}
		},
		onLoad (option){
			var data;
			var vm = this;
			uni.getStorage({
				key : 'newEnrollDraft',
				success :function(res){
					data = res.data;
					if(data != null){
						uni.showToast({
							title : "载入之前的草稿"
						})
						
					}
					vm.title = (data.title == null ? null : data.title);
					vm.isChecked = (data.checked == null ? false : data.checked);
					data.enrollLimit = (data.enrollLimit == null ? 0 : data.enrollLimit);
					vm.tempRegister = (data.enrollLimit & 1) == 1;
					vm.autoCheck = (data.enrollLimit >> 1 & 1) == 1;
					data.endMethod = (data.endMethod == null ? 0 : data.endMethod);
					vm.numEnd = (data.numEnd & 1) == 1;
					vm.timeEnd = (data.numEnd >> 1 & 1) == 1;
					vm.numEnd = data.numEnd;
					vm.enrollData = data;

				},
				fail : function(){
					data = null;
				}
			});
			
		},
		onBackPress(options) { 
			uni.navigateTo({
				url : '../user/main'
			}) 
            return true;  
        },  
		methods: {
			submit : function(){
				if(this.title == ""){
					uni.showModal({
						title : '错误',
						content : '题目不可为空',
						showCancel : false
					})
					return null;
				}
				// var data = {};
				this.enrollData['title'] = this.title;
				this.enrollData['checked'] = this.isChecked;
				var temp = 0;
				if(this.tempRegister) temp += 1;
				if(this.autoCheck) temp += 2;
				this.enrollData['enrollLimit'] = temp;
				// console.log(this.title)
				// console.log(this.isChecked)
				// console.log(this.tempRegister)
				// console.log(this.autoCheck)
				// console.log(this.readOthers)
				temp = 0;
				if(this.autoEnd){
					if(this.numEnd) temp += 1;
					if(this.timeEnd) temp += 2;
				}
				this.enrollData['endMethod'] = temp;
				// console.log(this.autoEnd)
				this.enrollData['numLimit'] = this.numLimit;

				var endTime = this.$refs.planEndTime.get();
				var planEndTime = new Date(endTime.year+'/'+endTime.month+'/'+endTime.day+' '+endTime.hour+':'+endTime.minute)
				// console.log(planEndTime)
				this.enrollData['planEndTime'] = planEndTime.getTime();
				// console.log(data['planEndTime'])
				// var test = this.$refs.planEndTime.get();
				// console.log(data);
				// return ;
				uni.setStorage({
					key : 'newEnrollDraft',
					data : this.enrollData
				})
				// // uni.setStorage('newEnrollDraft',data);
				// console.log(data);
				uni.navigateTo({
					url : 'newEnrollItem'
				});
			}
		}
	}
</script>

<style>
	@import "../../common/zcss.css";
	input{
		/* background-color: #D8D8D8; */
		border: 1upx solid black;
		width:400upx;
		
	}
	.desc-item{
		border: 1upx solid gray;
		border-top: 1upx solid gray;
		width: 99%;
		height:70upx;
		padding-top: 10upx;
		/* background-color: white; */
		position: relative;
	}
	.item-name{
		position: absolute;
		left: 1%;
		color: gray;
		top:10upx;
		font-size:40upx; 
	}
	.item-content{
		position: absolute;
		right: 1%;
		top:20upx;
		font-size:40upx; 
	}
	.item-switch{
		position: absolute;
		right: 1%;
		/* #ifdef H5 */
		top:10upx;
		/* #endif */
		/* #ifndef H5 */
		margin-bottom: 10upx;
		/* #endif */
		
	}
</style>
